<template>
	<div class="toCenters">

		<!-- 轮播图 -->
			<div class="lbt">
				<van-swipe :autoplay="3000">
					<van-swipe-item v-for="(image, index) in images" :key="index">
						<img v-lazy="image" />
					</van-swipe-item>
				</van-swipe>
			</div>
<!-- 商品 -->
		<!-- <div class="cp"> -->
			<div class="one" v-for="(v, index) in arr" :key="index" >
<!-- :img1="v.img1" :proname="v.proname" -->
<!-- :originprice="v.originprice" @click="goxqy(v)" -->
				<img :src="v.img1
				" alt="" class="img">
				<div class="price">
					<div class="jieshoao">{{ v.proname }}</div>
					<span class="an"> ￥&nbsp;{{ v.originprice }}</span>
						<span class="ren">{{
	v.discount
						}} 人已购买</span>
			</div>
			</div>
		</div>
	<!-- </div> -->
</template>

<script>
import Vue from 'vue';
import { Lazyload } from 'vant';
Vue.use(Lazyload);
export default {
	data() {
		return {
			arr: [
			// 	{ img1: "//gw.alicdn.com/bao/uploaded/i2/63905382/O1CN01fYW3Bh1pd0NKfMAK5_!!63905382.jpg_320x320q90.jpg_.webp", desc:"奶奶装夏装仿真丝套装老人衣服中老年人女唐装妈妈老太太T恤+裤子",money:"68",ren:"6"},
			// 	{ img1: "//gw.alicdn.com/bao/uploaded/i3/428676668/O1CN01ZEMBvc1z7zYJd905q_!!428676668.jpg_320x320q90.jpg_.webp", desc:"饮水机台式小型家用制冷热学生宿舍节能玻璃冰温热热水机特价包邮",money:"49",ren:"9"}
			],
			images: [
				'//gw.alicdn.com/tfs/TB1eMV3qDM11u4jSZPxXXahcXXa-513-750.jpg_q90.jpg_.webp',
				'//gw.alicdn.com/imgextra/i2/6000000005149/O1CN01sPW0O31nuI9RAg52p_!!6000000005149-0-lubanimage.jpg_q90.jpg_.webp',
				'//gw.alicdn.com/imgextra/i1/6000000001426/O1CN01yp7PcR1MP9bAcZpVR_!!6000000001426-0-lubanimage.jpg_q90.jpg_.webp',
				'//gw.alicdn.com/tfs/TB1XdfTmyDsXe8jSZR0XXXK6FXa-513-750.jpg_q90.jpg_.webp',
				

			],
		}
	},
	mounted() {
		this.$http({
			url: 'http://118.178.238.19:3001/api/pro/recommendlist',
			method: "get",
			// pramas: { count: 2, limitNum: 20, }
			// limitNum  每页显示个数,默认值为10
		}).then(res => {
			this.arr = res.data.data
			// console.log(res.data.data)
			console.log(this.arr);
		})
	}
	
	// mounted() {
	// 	this.$http({
	// 		url:'http://localhost:3000/sylist',
	// 		method: "get"
	// 	}).then(res => {
	// 		this.arr = res.data
	// 		console.log(this.arr);
	// 	})
	// }
	// methods: {
	// 	goxqy(v) {
	// 		sessionStorage.setItem('centers', JSON.stringify(v))
	// 		this.$router.push({
	// 			path: "/xqy",
	// 			query: {
	// 				center: JSON.stringify(v)
	// 			}
	// 		})
	// 	}
	// }

}
</script>

<style scoped>
.toCenters {
	padding: 10px;
	box-sizing: border-box;
	background-color: #f4f4f4;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.van-swipe {
	width: 100%;
	height: 5rem;
	border-radius: 10px;
}

img {
	width: 100%;
	height: 100%;
}

.lbt {
	height: 5rem;
	width: 3.4rem;
	border-radius: 10px;
}

.one {
		width: 3.55rem;
			height: 5.3rem;
			box-sizing: border-box;
			margin-top: 5px;
			font-size: .26rem;
			/* background-color: #f0eded; */
			display: flex;
			justify-content: space-evenly;
			flex-wrap: wrap;
}

.one .img {
	width: 100%;
	height: 3.4rem;
	border-radius:10px 10px 0 0;
}

.price {
	width: 100%;
	height: 1.85rem;
	padding: 8px;
	border-radius:0 0 10px  10px;
	box-sizing: border-box;
	background-color: white;
}
.jieshao{
	height: 1rem;
	font-size: 12px;
	overflow: hidden;
}
.price .an {
	display: block;
	font-size: .32rem;
	color: red;
	margin-top: 6px;
}

 .ren {
	display: block;
	position: relative;
 left: 2.1rem;
	font-size: .12rem;
	color: rgb(148, 147, 147);
	margin-top: -18px;
}
</style>